/* 这个文件是给博客列表页实现的样式 */

/* 设置整个博客的容器元素的样式 */
.blog {
    width: 100%;
    padding: 20px 10px 10px;
}

.blog .tittle {
    text-align: center;
    font-weight: 700;
    font-size: 24px;
    padding: 10px;
}

.blog .date {
    text-align: center;
    color: rgb(15,189,114);
    padding: 5px 10px 10px;
}

.blog .desc {
    text-indent: 2em;
}

.blog a {
    /* a标签默认会有下划线，去除下划线 */
    text-decoration: none;
    /* a标签为行内元素，不方便设置样式，转成块级元素 */
    display: block;
    width: 120px;
    height: 40px;
    line-height: 40px;
    /* 设置水平居中 */
    margin: 5px auto;
    /* 设置边框 */
    border: 2px solid black;
    /* 让文字水平居中 */
    text-align: center;
    /* 文字颜色改为黑色 */
    color: black;
    /* 圆角矩形 */
    border-radius: 2px;
    /* 鼠标悬停添加过渡效果 */
    transition: all 0.8s;
}


/* 设置当鼠标滑至按钮上的变化效果 */
.blog a:hover {
    color: white;
    background-color: #777;
}